<!-- 厂家-无法维修-维修情况 -->
<template>
	<Card>
		<template #head>
			维修情况
		</template>
		<template #body>
			<CellItem label="设备状态外观" v-model="formData.deviceState" dicKey="repair_equipment_status"></CellItem>
			<CellItem label="设备数据状态" v-model="formData.deviceData" dicKey="repair_equipment_data"></CellItem>
			<!-- 维修结算 -->
			<template v-if="hideenSettlement">

				<!-- 无法维修 -->
				<template v-if="!showHandleCompleteMaintenance">
					<CellField label="无法维修原因" input-align="left" v-model="formData.remark" type="textarea"></CellField>
				</template>
				<!-- 完成维修  -->
				<template v-if="showHandleCompleteMaintenance">
					<CellField label="故障原因" input-align="left" v-model="formData.faultReason" type="textarea"></CellField>
					<CellField label="处理过程" input-align="left" v-model="formData.process" type="textarea"></CellField>
				</template>
			</template>
			<CellItemAttachment v-model="formData.enclosure"></CellItemAttachment>

		</template>
	</Card>
</template>

<script>
	import Card from '@/components/card/components/cardBaseWrapper.vue'
	import PhotoButton from '@/components/button/photo.vue'
	import VideoButton from '@/components/button/video.vue'
	import UploadButton from '@/components/button/upload.vue'
	import CellItemAttachment from '@/components/cell/itemAttachment.vue'
	import {
		dicList
	} from '@/filter/index.js'
	export default {
		components: {
			Card,
			PhotoButton,
			VideoButton,
			UploadButton,
			CellItemAttachment
		},

		props: {
			showHandleCompleteMaintenance: Boolean,
			hideenSettlement: {
				type: Boolean,
				default: true
			}

		},
		data() {
			return {

				formData: {
					deviceState: 1,
					deviceData: 1,
					remark: '',
					enclosure: '',
					process: '',
					faultReason: '',
				}
			}
		},

		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.label {
		&-value {
			display: block;
			font-weight: 400;
			font-size: 28rpx;
			color: #409EFF;
			text-align: right;
		}

		&-content {
			text-align: right;
		}
	}

	.attachment {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
</style>
